<%@ page contentType="text/html;charset=UTF-8" %>
<%@ page import="org.apache.shiro.web.filter.authc.FormAuthenticationFilter"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html>

    <head>

        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta name="description" content="">
        <meta name="author" content="Alex Grozav">

        <title>${fns:getConfig('productName')} 登录</title>
        
        <!-- Favicon -->
        <link rel="shortcut icon" href="../favicon.ico" type="${ctxStatic}/image/x-icon">
        <link rel="icon" href="../favicon.ico" type="${ctxStatic}/image/x-icon">
        
        <!-- Bootstrap Core CSS -->
        <link href="${ctxStatic}/css/bootstrap.css" rel="stylesheet">

        <!-- MetisMenu CSS -->
        <link href="${ctxStatic}/css/plugins/metisMenu/metisMenu.min.css" rel="stylesheet">

        <!-- DataTables CSS -->
        <link href="${ctxStatic}/css/plugins/dataTables.bootstrap.css" rel="stylesheet">

        <!-- Custom CSS -->
        <link href="${ctxStatic}/css/smartech.css" rel="stylesheet">

        <!-- Custom Fonts -->
        <link href="${ctxStatic}/font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
        
        <!-- Animate CSS -->
        <link href="${ctxStatic}/css/animate.css" rel="stylesheet">
        
        <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
        <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
        <!--[if lt IE 9]>
            <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
            <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
        <![endif]-->
    </head>

    <body>

        <div id="wrapper">

        <!-- Navigation -->
            <nav class="navbar navbar-default navbar-static-top" role="navigation" style="margin-bottom: 0">

                <sys:header/>
                <!-- /.navbar-top-links -->

                <sys:sidebar menuId="1000"/>
                <!-- /.navbar-static-side -->
            </nav>

            <div id="page-wrapper">

                <!-- /.row -->
                <div class="row">
                    <div class="col-lg-12">
                        <div class="panel panel-default">
                            <div class="panel-heading">

                                <h4 class="margin-none">
                                    <i class="fa fa-user"></i>个人中心
                                </h4>

                            </div>
                            <!-- /.panel-heading -->
                            <div class="panel-body">
                                <form:form  id="inputForm"  modelAttribute="user" class="form-horizontal" method="post" action="${ctx}/sys/user/save">
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label">头像:</label>
                                        <div class="col-sm-6">
                                            <iframe src="${ctx}/sys/user/headImage" height="90" width="100%" frameborder="0" scrolling="no" ></iframe>
                                            <%--<img src="${ctxStatic}/img/profile-8.jpg" alt="alena" class="img-rounded margin-right" width="65">--%>
                                            <%--<span class="inputfile">--%>
                                                <%--<span class="btn btn-primary"><i class="fa fa-upload"></i> 上传</span>--%>
                                                <%--<input type="file" value="" class="" style="position: absolute; top:0; left: 0; opacity: 0;"/>--%>
                                                <form:hidden path="avatar" />
                                            <%--</span>--%>
                                            <%--<span class="help-block">注：请上传图片为PNG/JPG/png/jpg,比例为1:1的图片，大小小于2M</span>--%>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label">账号:</label>
                                        <div class="col-sm-6">
                                            <form:hidden path="account" />
                                            <p style="line-height: 35px">${user.account}</p>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label">LOGO:</label>
                                        <div class="col-sm-6">
                                            <iframe src="${ctx}/sys/user/logoImage" height="90" width="100%" frameborder="0" scrolling="no" ></iframe>
                                            <%--<img src="${ctxStatic}/img/logo.png" alt="alena" class="img-rounded margin-right" width="65">--%>
                                            <%--<span class="inputfile">--%>
                                                <%--<span class="btn btn-primary"><i class="fa fa-upload"></i> 上传</span>--%>
                                                <%--<input type="file" value="" class="" style="position: absolute; top:0; left: 0; opacity: 0;"/>--%>
                                                <form:hidden path="logo"/>
                                            <%--</span>--%>
                                            <%--<span class="help-block">注：请上传图片为PNG/JPG/png/jpg,比例为140:50的图片，大小小于2M</span>--%>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label">渠道名称:</label>
                                        <div class="col-sm-6">
                                            <form:input path="name" type="text" class="form-control" placeholder="请输入渠道名称"/>
                                            <span class="help text-danger"></span>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label">联系电话:</label>
                                        <div class="col-sm-6">
                                            <form:input path="tel" type="text" class="form-control" placeholder="请输入联系电话"/>
                                            <span class="help-block">注：输入格式，例如"183****2124";"010-3872***90"</span>
                                            <span class="help text-danger"></span>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label class="col-sm-3 control-label">地址:</label>
                                        <div class="col-sm-6 form-inline">
                                            <form:select path="province" class="form-control" id="location_p" itemValue="province"/>
                                            <form:select path="city" class="form-control" id="location_c" itemValue="city"/>
                                            <form:select path="area" class="form-control" id="location_a" itemValue="area"/>
                                            <form:input path="addr" type="text" placeholder="请输入详细地址" class="form-control margin-top" style="min-width: 222px;"/>
                                            <span class="help text-danger"></span>
                                        </div>
                                    </div>
                                    <div class="form-group ">
                                        <div class="col-sm-offset-3 col-sm-6">
                                            <button type="button" class="btn btn-default margin-right" data-dismiss="modal">取消</button>
                                            <input class="btn btn-primary" type="submit" value="保 存"/>
                                        </div>
                                    </div>
                                </form:form>

                            </div>
                            <!-- /.panel-body -->
                        </div>
                        <!-- /.panel -->
                    </div>
                    <!-- /.col-lg-12 -->
                </div>
                <div class="text-center margin-top footer">&copy; 2015北京坤腾畅联科技有限公司  版权所有</div>
            </div>
            <!-- /#page-wrapper -->

        </div>
        <!-- /#wrapper -->

          <!--修改密码-->
            <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
              <div class="modal-dialog" role="document">
                <div class="modal-content">
                  <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">修改密码</h4>
                  </div>
                  <div class="modal-body">
                        <form  class="form-horizontal" role="form" method="post" action=" action="${ctx}/profile">
                            <fieldset>
                                <div class="form-group">
                                    <label class="col-sm-3 control-label">原始密码:</label>
                                    <div class="col-sm-9">
                                        <input type="Password" class="form-control" placeholder="" name="oldLoginName" value="" >
                                    </div>
                                </div>
                                <div class="form-group">
                                    <label class="col-sm-3 control-label">新密码:</label>
                                    <div class="col-sm-9">
                                        <input type="Password" class="form-control" placeholder="请输入8-20位任意字符组成" name="Password" >
                                    </div>
                                </div>
                                 <div class="form-group">
                                    <label class="col-sm-3 control-label">确认新密码</label>
                                    <div class="col-sm-9">
                                        <input type="Password" class="form-control" placeholder="" name="Password" >
                                    </div>
                                </div>
                            </fieldset>
                        </form>
                  </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                    <button type="submit" class="btn btn-primary" >确定</button>
                  </div>
                </div>
              </div>
            </div>

        <!-- jQuery Version 1.11.0 -->
        <script src="${ctxStatic}/js/jquery-1.11.0.js"></script>

        <!-- Bootstrap Core JavaScript -->
        <script src="${ctxStatic}/js/bootstrap.min.js"></script>

        <script src="${ctxStatic}/js/plugins/layer/layer.js"></script>

        <!-- validate JavaScript -->
        <script src="${ctxStatic}/js/plugins/validate/jquery.validate.min.js"></script>

        <!-- DataTables JavaScript -->
        <%--<script src="${ctxStatic}/js/plugins/dataTables/jquery.dataTables.js"></script>--%>
        <%--<script src="${ctxStatic}/js/plugins/dataTables/dataTables.bootstrap.js"></script>--%>
        <!-- PICA JavaScript -->
        <script src="${ctxStatic}/js/plugins/PICAClass/PCASClass.js"></script>

        <!-- Custom Theme JavaScript -->
        <script src="${ctxStatic}/js/smartech.js"></script>

        <!-- Page-Level Demo Scripts - Tables - Use for reference -->
        <script>

            // 手机号码验证
            jQuery.validator.addMethod("isTel", function(value, element) {
                var re1 = /^((0\d{2,3})-)(\d{7,8})(-(\d{3,}))?$/; // 固话
                if(re1.test(value)){
                    var flag1 = true;
                } else {
                    var flag1 = false;
                }
                var re2 = /^1\d{10}$/;
                if (re2.test(value)) {
                    var flag2 = true;
                } else {
                    var flag2 = false;
                }
                return this.optional(element) || ((flag1 || flag2));
            }, "输入联系电话格式不正确");

            $(document).ready(function() {
                var loc_province='${user.province}', loc_city='${user.city}', loc_area='${user.area}';
                var pcas = new PCAS('province', 'city', 'area');
                if (loc_province != '') {
                    pcas.SetValue(loc_province, loc_city, loc_area);
                }

                var messages = "${successMessage}";
                if(messages){
                    layer.msg(messages, {time: 4000, icon:0});
                }

                $("#inputForm").validate({
                    rules: {
                        name : {
                            required : true
                        },
                        tel : {
                            required : true,
                            isTel : true
                        },
                        addr : {
                            required : true
                        }
                    },
                    messages : {
                        name : {
                            required : "输入不能为空"
                        },
                        tel : {
                            required : "输入不能为空"
                        },
                        addr : {
                            required : "输入不能为空"
                        }
                    },
                    errorPlacement: function(error, element) {
                        error.appendTo(element.siblings(".help"));
                    }
                });

            });


        </script>
    </body>

</html>
